<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="static/img/logo.png" type="image/x-icon">
    <title>eqntest</title>
    <link href="https://cdn.bootcss.com/font-awesome/5.7.2/css/all.min.css" rel="stylesheet">
    <link href="static/css/slidercaptcha.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">

</head>
<body>
<a id="test" href="/sendEmail">123</a>
<form action="">
    <textarea name="editor" id="editor1" cols="80" rows="10"></textarea>
    <div id="captcha"></div>
</form>
<table>
    <tbody>
    <tr>
        <td>认证邮件</td>
    </tr>
    <tr>
        <td>
            罗志辉,
            <br>
            <br>
            你好,恭喜您加入了lzhphantom-Math！想学习基础知识吗？ 看看我们的学习中心指南。

        </td>
    </tr>
    </tbody>
</table>
<table>
    <tbody>
    <tr>
        <td>
            <br>
            <div><a href="http://127.0.0.1:8080/verify?code=" class="verify">认证</a></div>
            <br>
        </td>
    </tr>
    </tbody>
</table>
<table>
    <tbody>
    <tr>
        <td>
            认证员1,
            <br>
            lzhphantom-Math 认证小组f
            <br>
        </td>
    </tr>
    </tbody>
</table>
<script src="static/js/jquery.min.js"></script>
<script type="text/javascript" src="static/lib/MathJax/MathJax.js?config=TeX-MML-AM_CHTML"></script>
<script type="text/javascript" src="static/lib/ckeditor5-build-classic/build/ckeditor.js"></script>
<script type="text/javascript" src="static/js/slidercaptcha.js"></script>
<script>
    // CKEDITOR.replace('editor1');
    function matchAll(str, reg) {
        var res = []
        var match
        while (match = reg.exec(str)) {
            res.push(match)
        }
        return res
    }

    ClassicEditor.create(document.querySelector('#editor1')).then(newEditor => {
        newEditor.model.document.on("change:data", () => {
            let data = newEditor.getData();
            let arr = data.split(/<p>|<\/p>/);
            for (let i = 0; i < arr.length; i++) {
                if (arr[i] == "") {
                    arr.splice(i, 1);
                    i--;
                }
            }
            let content = ``;
            for (let i = 0; i < arr.length; i++) {
                content += `<p>\\(` + arr[i] + `\\)</p>`;
            }

            if (content.length > 0) {
                $("#test").html(content);
                MathJax.Hub.Queue(["Typeset", MathJax.Hub, "test"]);
            } else {
                $("#test").html(data);
            }
        });
    });


</script>
<script>
    $("#captcha").sliderCaptcha({
        // width: 280,//背景图片宽度
        // height: 150,//背景图标高度
        // sliderL: 42,//拼图宽度
        // sliderR: 9,//拼图突出半径
        // offset: 5,//验证容错偏差值 默认5个像素偏差即认为验证通过
        // loadingText: '正在加载中...',//图片加载时显示的文本信息
        // failedText: '再试一次',//验证失败时显示的文本信息
        // barText: '向右滑动填充拼图',//拖动滑块准备拖动时显示的文本信息
        repeatIcon: 'fa fa-redo',//重新加载图标 需引用 font-awesome
        setSrc: function () {//设置图片加载路径
            return 'static/img/slider/Pic' + Math.round(Math.random() * 4) + '.jpg';
        },
        onSuccess: function () {//验证通过时回调此函数
            let hideSlider = setInterval(() => {
                $("#captcha").addClass("hidden");
                clearInterval(hideSlider);
            }, 1500)
        },
        onFail: function () {//验证失败时回调此函数

        },
        onRefresh: function () {//点击重新加载图标时回调此函数

        }
    });
</script>
</body>
</html>